<html>

<head>
	<title>KeePass - Popup</title>
	<link rel="stylesheet" href="popup.css" />
	<link rel="stylesheet" href="../bootstrap-btn.css" />
	<script type="text/javascript" src="../browser-polyfill.min.js"></script>
	<script type="text/javascript" src="../jquery-3.2.1.min.js"></script>
	<script type="text/javascript" src="popup_functions.js"></script>
	<script type="text/javascript" src="popup.js"></script>
	<script src="../translate.js" defer></script>
</head>

<body>
	<div id="settings" class="settings">
		<button id="btn-options" class="b2c-btn b2c-btn-small b2c-btn-warning"><span
				data-i18n="settings"></span></button>
		<button id="btn-choose-credential-fields" class="b2c-btn b2c-btn-small"><span
				data-i18n="chooseFields"></span></button>

		<div id="update-available">
			<span data-i18n="oldVersion"></span>
		</div>
	</div>

	<div id="initial-state">
		<p><img style="margin-right: 1em" src="throbber.gif" /><span data-i18n="checkingStatus"></span></p>
	</div>

	<div id="not-configured" style="display: none">
		<p>
			<span data-i18n="connectStatus"></span>
		</p>
		<div style="text-align: right">
			<button id="connect-button" class="b2c-btn b2c-btn-primary"><span data-i18n="connect"></span></button>
		</div>
	</div>

	<div id="need-reconfigure" style="display: none">
		<p>
			<span data-i18n="disConnect"></span>
		</p>
		<code id="need-reconfigure-message"></code>
		<p>
			<span data-i18n="reconnect"></span>
		</p>
		<div style="text-align: right">
			<button id="reconnect-button" class="b2c-btn b2c-btn-primary"><span data-i18n="reconnect1"></span></button>
		</div>
	</div>

	<div id="configured-not-associated" style="display: none">
		<p>
			<span data-i18n="connectedDes"></span>
		</p>
	</div>

	<div id="configured-and-associated" style="display: none">
		<p>
			<span data-i18n="connectedDes1"></span>
		</p>
		<div style="text-align: right">
			<button id="redetect-fields-button" class="b2c-btn"><span data-i18n="credentialFields"></span></button>
		</div>
	</div>

	<div id="error-encountered" style="display: none">
		<p>
			<span data-i18n="encountered"></span>
		</p>
		<p style="margin-left: 1em">
			<code id="error-message"></code>
		</p>
		<div style="text-align: right">
			<button id="reload-status-button" class="b2c-btn"><span data-i18n="reload"></span></button>
		</div>
	</div>
</body>

</html>